/* eslint-disable react/prop-types */
/* eslint-disable react/jsx-props-no-spreading */
import React, { forwardRef, useImperativeHandle } from 'react';
import Button from '@mui/material/Button';
import Dialog from '@mui/material/Dialog';
import DialogActions from '@mui/material/DialogActions';
import DialogContent from '@mui/material/DialogContent';
import DialogContentText from '@mui/material/DialogContentText';
import DialogTitle from '@mui/material/DialogTitle';
import Slide from '@mui/material/Slide';

const Transition = React.forwardRef(function Transition(props, ref) {
  return <Slide direction="up" ref={ref} {...props} />;
});

const Modal = ({
  open,
  onClose,
  title,
  children,
  onOk,
  size,
  fullScreen,
  footer,
}) => {
  return (
    <Dialog
      open={open}
      onClose={onClose}
      TransitionComponent={Transition}
      fullWidth
      maxWidth={size || 'sm'}
      aria-describedby="alert-dialog-slide-description"
      fullScreen={fullScreen}
    >
      <DialogTitle bgcolor="#333">{title}</DialogTitle>
      <DialogContent style={{ backgroundColor: '#333' }}>
        {children}
      </DialogContent>
      {footer === false ? null : (
        <DialogActions style={{ backgroundColor: '#333' }}>
          <Button onClick={onClose}>取消</Button>
          <Button onClick={onOk} type="submit">
            确定
          </Button>
        </DialogActions>
      )}
    </Dialog>
  );
};

export default Modal;
